<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>模板消息设置</title>
    <link rel="stylesheet" type="text/css" href="css/style.css"/>
    <link rel="stylesheet" type="text/css" href="css/aui.css"/>
    <script src="js/art-template.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/jquery-1.11.1.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
    <script src="js/wxrem.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/md5.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
        document.writeln("<script type=\"text/javascript\" src=\"js/common.js?" + Math.random() + "\"></scr" + "ipt>");
    </script>

</head>
<style>
    .box {
        overflow: hidden;
        background: #f5f5f5;
        height: 100%;
    }

    .template_title {
        height: 2.7rem;
        width: 100%;
        margin-top: 1.5rem;
    }

    .template_title p {
        width: 9.6rem;
        height: 2.7rem;
        float: right;
        background: #ffd74b;
        border-radius: 1.4rem 0 0 1.4rem;
        text-align: center;
        line-height: 2.7rem;
        color: #101010;
        font-size: 1.4rem;
        box-shadow: 3px 1px 12px 1px #ffd74b;
    }

    .template_title_r {
        font-size: 1.5rem;
        padding: 0 1.5rem;
        line-height: 2rem;
        text-align: left;
        margin-top: 2rem;
    }

    .template_title_p {
        font-size: 1.4rem;
        color: #666;
        padding: 0 1.5rem;
        margin-top: 1.5rem;
        line-height: 2.5rem;
    }

    .template_title_list {
        margin-top: 2.2rem;
        padding: 0 1.5rem;
        border-radius: 4px;
        box-shadow: 0px 5px 20px #ededed;
        margin-bottom: 2.2rem;
    }

    .template_title_list div {
        line-height: 4.7rem;
        height: 4.7rem;
    }

    .template_title_list div:nth-child(1) {
        border-bottom: 1px solid #ebebeb;
    }

    .template_title_list div b {
        font-size: 1.3rem;
        color: #333333;
    }

    .template_title_list div span {
        font-size: 1.3rem;
        color: #666;
    }

    .template_title_list div p {
        width: .7rem;
        height: .7rem;
        background: rgba(0, 0, 0, 0);
        display: inline-block;
        border-radius: 50%;
        margin-right: .8rem;
        border: 1px solid #a1a1a1;
        float: left;
        margin-top: 1.9rem;
    }

    .template_text {
        color: #ec4137;
        font-size: 1.2rem;
        padding: 0 1.5rem;
        margin-bottom: 3.5rem;
        line-height: 2.5rem;
      }

    .template_btn {
        width: 90%;
        height: 5rem;
        border-radius: 2.5rem;
        background: #ffd74b;
        margin: 0 auto;
        font-size: 1.5rem;
        font-weight: bold;
        color: #222222;
        line-height: 5rem;
        text-align: center;
    }

    .template_bottom {
        text-align: center;
        font-size: 1.3rem;
        color: #a1a1a1;
        margin-top: 2rem;
    }

    .action_p {
        background: red !important;
        border: 0 !important;
    }
    .bag{
        position: fixed;
        z-index: 100;
        background: rgba(0,0,0,.5);
        height: 100%;
        width: 100%;
        display: none;
    }
    .model_msg{
        width: 28rem;
        height: 27rem;
        z-index: 105;
        position: fixed;
        background: #fff;
        top: 50%;
        left: 50%;
        margin-top: -14rem;
        margin-left: -14rem;
        border-radius: 4px;
        padding: 0 2rem;
         display: none;
    }
    .model_msg h1{
        text-align: center;
        font-size: 1.5rem;
        font-weight: bold;
        line-height: 5rem;
        margin-top: 1rem;
    }
    .model_msg h3{
        text-align: left;
        font-size: 1.35rem;
        color: #000;
        margin-bottom: 1.3rem;
    }
    .model_msg p{
        text-align: left;
        font-size: 1.3rem;
        color: #666;
        line-height: 2.5rem;
        margin-bottom: 1.1rem;
    }
    .model_msg a{
        text-align: left;
        font-size: 1.3rem;
        color: #3292ff;
        margin-bottom: 1.1rem;
        text-decoration:underline;
    }
</style>
<body>
<div class="bag"></div>
<div class="model_msg">
    <h1> 如何添加模板消息？</h1>
    <h3>教你三步开通模板消息功能：</h3>
    <p>➤第一步：进入微信后台，点击左侧菜单栏【添加功能插件】，选择【模板消息】</p>
    <p>➤第二步：点击【申请】</p>
    <p>➤第三步：填写申请信息后点击【提交】</p>
    <a>>>点击查看【如何添加模板消息？】</a>
</div>
<div class="box">
    <div class="template_title">
        <p>查看消息推送</p>
    </div>
    <div class="template_title_r">模板消息行业配置</div>
    <p class="template_title_p">每日上新书籍模板消息必须有一个行业为“教育/培训”，请选择一个行业进行替换</p>
    <div class="template_title_list">
        <!--<div><p class="action_p p_1"></p><span>模板消息所在行业：</span><b>金融保险</b></div>-->
        <!--<div><p class="p_2"></p><span>模板消息所在行业：</span><b>IT软件与服务</b></div>-->
    </div>
    <div class="template_text">
        操作提示：模板消息锁在行业每个月只能修改一次，被替换行业的模板消息将无法继续使用，请确认被替换行业的模板消息没有业务在使用，请谨慎操作。
    </div>
    <div class="template_btn">
        完成
    </div>
    <!--  <p class="template_bottom">
          跳过，暂不设置
      </p>-->
</div>
</body>
<script>
    var sign = hex_md5(objKeySort({token: token, timestamp: date}))
    $.ajax({
        type: "get",
        url: hostUrl + "merchant/template/get",
        data:{token: token, timestamp: date,sign:sign},
        async: true,
        success: function (data) {
            var obj = data.data

            var arr = []
            for (var i = 0; i < obj.length; i++) {//循环判断拿到消息对应的模板
                if (obj[i].title == '会员到期通知' || obj[i].title == '学习计划提醒') {
                    if (obj[i].deputyIndustry == '培训' && obj[i].primaryIndustry == '教育')
                        arr.push(data.data[i])
                }
            }
            if(arr.length < 2 ){ //判断是否有对应的消息模板
                $('.model_msg').show()
                $('.bag').show()
                return
            }else {

            }
          $.each(arr, function ( i , obj) {//渲染消息末班
              if(obj.title == '会员到期通知'){
                  $('.template_title_list').append('<div data-type = "2" data-id="'+ obj.templateId +'"><p class="action_p p_1"></p><span>模板消息所在行业：</span><b>'+ obj.primaryIndustry +' | '+ obj.deputyIndustry +' |  '+ obj.title +'</b></div>')
              }else {
                  $('.template_title_list').append('<div data-type = "1" data-id="'+ obj.templateId +'"><p class="action_p p_1"></p><span>模板消息所在行业：</span><b>'+ obj.primaryIndustry +' | '+ obj.deputyIndustry +' |  '+ obj.title +'</b></div>')
              }
          })


        }
    });
    $('.template_btn').click(function () {//点击完成按钮

                var templatearr=[]
                $('.template_title_list div').each(function () {
                    var obj= {}
                    obj.type = $(this).data('type')
                    obj.templateId = $(this).data('id')+''
                    templatearr.push(obj)
                })
                var templateIds = JSON.stringify(templatearr)
                var sign = hex_md5(objKeySort({token: token, timestamp: date}))
                $.ajax({
                    type: "post",
                    url: hostUrl + "merchant/template/save",
                    data: {
                        templateIds: templateIds,
                        sign:sign,
                        token:token,
                        timestamp:date
                    },
                    // contentType: "application/json",
                    async: true,
                    success: function (data) {
                        if(data.status==0){
                            alert('成功设置消息模板')
                            location.href='joinUp.html'
                        }

                    }
                });



    })
    $('.bag').click(function () {
        $('.model_msg').show()
        $('.bag').show()
    })
    $('.model_msg a').click(function () {
        location.href='https://mp.weixin.qq.com/s?__biz=MzUzNTk1ODA3Mg==&mid=2247483670&idx=3&sn=2758011ad130f027348f940196ad3117&chksm=fafcc641cd8b4f578ee9c77999088157a26fc7ee6062ba59f59b81df39b54f97d879484cf613&token=672158135&lang=zh_CN#rd'
        // location.href='https://mp.weixin.qq.com/s?__biz=MzUzNTk1ODA3Mg==&mid=2247483669&idx=3&sn=3b173ccacd1e883d9c5f7a6b218bd4e2&chksm=fafcc642cd8b4f54a9424c4b31c5dde880774fec9e0163e90810a00e59c986daaa8ebc850349&token=1232300861&lang=zh_CN#rd'
    })


    $('.template_title p').click(function () {
        location.href='https://mp.weixin.qq.com/s?__biz=MzUzNTk1ODA3Mg==&mid=2247483670&idx=3&sn=2758011ad130f027348f940196ad3117&chksm=fafcc641cd8b4f578ee9c77999088157a26fc7ee6062ba59f59b81df39b54f97d879484cf613&token=672158135&lang=zh_CN#rd'
        // location.href='https://mp.weixin.qq.com/s?__biz=MzUzNTk1ODA3Mg==&mid=2247483669&idx=3&sn=3b173ccacd1e883d9c5f7a6b218bd4e2&chksm=fafcc642cd8b4f54a9424c4b31c5dde880774fec9e0163e90810a00e59c986daaa8ebc850349&token=1232300861&lang=zh_CN#rd'
    })

</script>
</html>